<template>
  <div>
    <Form ref="formData" :model="formData" :label-width="140">
      <Card
        title="待准入商品查看"
        :bordered="false"
        dis-hover
        class="ivu-mt i-table-no-border"
      >
        <Row type="flex" justify="end"> </Row>
        <Row>
          <Table
            :columns="columns1"
            :data="baseTableData"
            width="100%"
            ref="table"
            @on-select="handleSelect"
          >
            <!-- <template slot-scope="{ row,index }" slot="checkFrequency">
                            <Input v-model="row.checkFrequency" @on-change="onChageRow(row,index)"
                                placeholder="请输入..." />
                        </template>
                        <template slot-scope="{ row,index }" slot="checkTime">
                            <Select v-model="row.checkTime" style="width:100%" transfer>
                                <Option v-for="item in checkTimeList" :value="item.value" :key="item.name">
                                    {{ item.name }}</Option>
                            </Select>
                        </template>
                        <template slot-scope="{ row,index }" slot="action">
                            <a @click="toDel(row,index)" style="margin-right: 15px;">删除</a>
                        </template> -->
          </Table>
        </Row>
      </Card>
      <!-- 分页 end  -->
    </Form>
  </div>
</template>
<script>
import { ApiRequest } from '@api/basePage';
export default {
  mixins: [],
  components: {},
  data () {
    return {
      totalNum: 0,
      pageShow: 10,
      nowPage: 1,
      baseTableData: [],
      skuNoList: [],
      uuids: '',
      checkTimeList: [
        {
          value: '1',
          name: '入库前'
        },
        {
          value: '2',
          name: '入库后'
        }
      ],
      productName: '',
      spuNo: '', // spuNo_q=EQ
      ready: true,
      colums2: [],
      columns1: [
        {
          key: 'cash',
          fixed: 'left',
          align: 'center',
          type: 'selection',
          minWidth: 80
        },
        {
          title: '分类',
          key: 'categoryPath',
          minWidth: 180
        },
        {
          title: 'SPU编码',
          key: 'spuNo',
          align: 'center',
          minWidth: 140
        },
        {
          title: 'SKU编码',
          key: 'skuNo',
          align: 'center',
          minWidth: 140
        },
        {
          title: '商品名称',
          key: 'productName',
          align: 'center',
          minWidth: 140
        },
        {
          title: '品牌',
          key: 'brandName',
          align: 'center',
          minWidth: 140
        },
        {
          title: '规格',
          key: 'specDetailStr',
          align: 'center',
          minWidth: 140
        },
        {
          title: '验收频率',
          key: 'checkFrequency',
          align: 'center',
          minWidth: 140
        },
        {
          title: '验收时间',
          key: 'checkTime',
          align: 'center',
          minWidth: 140
        }
      ],
      formData: {
        createOpeTime: '',
        departmentName: '',
        surveyMan: '',
        surveyArea: '',
        recordNo: '',
        surveyTarget: '',
        surveyReault: ''
      },
      apiObj: {
        // 点击批量维护/查看/编辑，进入维护页面（品类、商品状态必须相同）
        getListByUuids: {
          url: '/sysback/checkstandarddetail/getListByUuids', // 接口地址
          type: 'post' // 接口请求类型
        },
        // 保存
        saveBasicInfo: {
          url: '/sysback/checksd/finish/commitFinish', // 接口地址
          type: 'post' // 接口请求类型
        }
      }
    };
  },
  created () {
    this.uuids = this.$route.query.uuids;
    this.initData();
  },
  methods: {
    initData () {
      let data = {};
      // 开始请求列表
      ApiRequest(
        this.apiObj.getListByUuids.url + '?uuids=' + this.uuids,
        this.apiObj.getListByUuids.type,
        data,
        false
      ).then(res => {
        if (res.retStatus === '1') {
          let reData = res.retData;
          this.initView(reData);
        }
      });
    },
    initView (reData) {
      this.baseTableData = [];
      this.colums2 = [];
      reData.forEach((element, oneIndex) => {
        this.baseTableData.push({
          uuid: element.uuid,
          operationNumber: element.operationNumber,
          createOpeTime: element.createOpeTime,
          skuNo: element.skuNo,
          specDetailStr: element.specDetailStr,
          spuNo: element.spuNo,
          productUuid: element.productUuid,
          productName: element.productName,
          categoryPath: element.categoryPath,
          brandName: element.brandName,
          checkTime: element.checkTime,
          checkTimeUpdate: element.checkTimeUpdate,
          checkFrequency: element.checkFrequency,
          checkFrequencyUpdate: element.checkFrequencyUpdate,
          brandName: element.brandName,
          productAddState: element.productAddState,
          categoryName: element.categoryName,
          detailList: element.detailList
        });
        element.detailList.forEach((item, index) => {
          if (oneIndex === 0) {
            this.pushItem(item, oneIndex, index, reData.detailList);
          }
        });
      });
      this.colums2.push({
        title: '操作',
        slot: 'action',
        align: 'center',
        minWidth: 120
      });
      this.colums2.forEach((element, index) => {
        this.columns1.push(element);
      });
    },
    // 导出表格
    exportTable () {
      if (
        this.skuNoList === null ||
        this.skuNoList.length === 0 ||
        this.skuNoList === undefined
      ) {
        this.$Message.error('请先勾选要导出的数据');
        return false;
      } else {
        window.location.href =
          this.exportBaseURL +
          '/sysback/checksd/finish/exportPageToExcelGet?skuNoList=' +
          this.skuNoList.join(',') +
          '&menuId=166&buttonId=2';
      }
    },
    handleSelect (row) {
      this.skuNoList = [];
      row.forEach(element => {
        this.skuNoList.push(element.skuNo);
      });
    },
    // 表格里面的删除操作
    toDel (row, index) {
      this.baseTableData.splice(index, 1);
    },
    // 数据赋值处理
    onChageRow (row, index) {
      this.baseTableData[index] = row;
    },
    // 生成代码
    pushItem (item, waiIndex, neiIndex, row) {
      let checkCountUpdateValues = ''; // 验收次数
      let standardValueUpdateValues = ''; // 标准值
      let upDiffValueUpdateValues = ''; // 上差
      let downDiffValueUpdateValues = ''; // 下差
      let checkMethodUpdateValues = ''; // 验收方法
      if (item.checkItemType === '1') {
        this.colums2.push({
          title: item.checkItemName,
          key: item.checkItemName,
          width: 150,
          align: 'center',
          children: [
            {
              title: '验收次数值',
              key: item.checkCount,
              align: 'center',
              width: 150,
              render: (h, params) => {
                return h('div', item.checkCount);
              }
            },
            {
              title: '标准值',
              key: item.standardValue,
              align: 'center',
              width: 150,
              render: (h, params) => {
                return h('div', item.standardValue);
              }
            },
            {
              title: '上差值',
              key: item.upDiffValue,
              align: 'center',
              width: 150,
              render: (h, params) => {
                return h('div', item.upDiffValue);
              }
            },
            {
              title: '下差值',
              key: item.downDiffValue,
              align: 'center',
              width: 150,
              render: (h, params) => {
                return h('div', item.downDiffValue);
              }
            },
            {
              title: '验收方法值',
              key: item.checkMethod,
              align: 'center',
              width: 150,
              render: (h, params) => {
                return h('div', item.checkMethod);
              }
            }
          ]
        });
      } else {
        this.colums2.push({
          title: item.checkItemName,
          key: item.checkItemName,
          width: 150,
          align: 'center',
          children: [
            {
              title: '验收次数值',
              key: item.checkCount,
              align: 'center',
              width: 150,
              render: (h, params) => {
                return h('div', item.checkCount);
              }
            },
            {
              title: '标准值',
              key: item.standardValue,
              align: 'center',
              width: 150,
              render: (h, params) => {
                return h('div', item.standardValue);
              }
            },
            {
              title: '验收方法值',
              key: item.checkMethod,
              align: 'center',
              width: 150,
              render: (h, params) => {
                return h('div', item.checkMethod);
              }
            }
          ]
        });
      }
    },
    // 数据赋值处理
    onChageRow1 (key, value, waiIndex, neiIndex, lieIndex, row) {
      if (key === 'cishu') {
        this.baseTableData[lieIndex].detailList[neiIndex].checkCount = value;
        this.baseTableData[lieIndex].detailList[neiIndex].checkCountUpdate = value;
      } else if (key === 'biaozhun') {
        this.baseTableData[lieIndex].detailList[neiIndex].standardValue = value;
        this.baseTableData[lieIndex].detailList[neiIndex].standardValueUpdate = value;
      } else if (key === 'shangcha') {
        this.baseTableData[lieIndex].detailList[neiIndex].upDiffValue = value;
        this.baseTableData[lieIndex].detailList[neiIndex].upDiffValueUpdate = value;
      } else if (key === 'xiacha') {
        this.baseTableData[lieIndex].detailList[neiIndex].downDiffValue = value;
        this.baseTableData[lieIndex].detailList[neiIndex].downDiffValueUpdate = value;
      } else {
        this.baseTableData[lieIndex].detailList[neiIndex].checkMethod = value;
        this.baseTableData[lieIndex].detailList[neiIndex].checkMethodUpdate = value;
      }
    },
    // 保存
    submit () {
      let mySubmitList = [];
      this.ready = true;
      this.baseTableData.forEach(element => {
        if (
          element.checkFrequency === '' ||
          element.checkFrequency === null ||
          element.checkFrequency === undefined
        ) {
          // this.$Message.error('验收频率不能为空');
          this.ready = false;
        }
        if (
          element.checkTime === '' ||
          element.checkTime === null ||
          element.checkTime === undefined
        ) {
          // this.$Message.error('验收时间不能为空');
          this.ready = false;
        }
      });

      this.baseTableData.forEach(element => {
        mySubmitList.push({
          checkFrequencyUpdate: element.checkFrequency,
          checkTimeUpdate: element.checkTime,
          skuNo: element.skuNo,
          spuNo: element.spuNo,
          productUuid: element.productUuid,
          itemList: element.detailList
        });
      });

      if (!this.ready) {
        this.$Message.error('确保列表内容不能为空');
        return false;
      }
      ApiRequest(
        this.apiObj.saveBasicInfo.url,
        this.apiObj.saveBasicInfo.type,
        mySubmitList,
        false
      ).then(res => {
        if (res.retStatus === '1') {
          this.$Message.success('保存成功');
          this.$router.go(-1);
        }
      });
    },
    // 上传格式验证失败
    uploadformaterr (file, fileList) {
      this.$Message.error('格式错误');
    },
    // 上传之前
    uploadbefore () {
      this.baseTableData = [];
    },
    // 上传成功
    uploadsuccess (file) {
      if (file.retStatus === '1') {
        // 如果上传成功,并且接口返回成功,对表格进行赋值操作.
        this.baseTableData = file.retData;
      } else {
        // 如果接口返回失败,就打印失败信息
        this.$Message.success(file.retMessage);
      }
    },
    // 上传失败
    uploaderror () {
      this.$Message.error('上传失败');
    }
  }
};
</script>
<style lang="less" scoped>
.div {
  display: flex;

  > span:nth-of-type(2),
  > span:nth-of-type(3) {
    margin-left: 20px;
  }
}

.marginTop10 {
  margin: 5px 0;
}
</style>
